CSS tooltips
February 01, 2004
Create tooltipsA ToolTip is a descriptive text box that appears when the mouse pointer is held over a tool, button or other object using the technique demonstrated at madaboutstyle.
a.info{
position:relative; /*this is the key*/
z-index:24; background-color:#fff;
color:#000;
border-bottom:1px dotted #999;
cursor: help;
text-decoration:none
}
a.info:hover{
z-index:25; background-color:#ff0}
border-bottom:1px dashed #999;
text-decoration:none
}
a.info span{display: none}
a.info:hover span{ /*display just on :hover state*/
display:block;
position:absolute;
top:2em; left:2em; width:15em;
border:1px solid #999;
background-color:#ECECEC; color:#000;
text-align: center
}
